<template>
  <q-page class="q-pa-md">
    <div class="q-pb-md text-h5">
      {{ pageTitle }}
      <span class="text-subtitle1">{{ pageSubTitle }}</span>
    </div>
    <div class="q-pa-sm shadow-2 q-mb-md">
      <div class="q-gutter-sm">
        <q-btn @click="detailNav.goBackToList" color="primary" icon="arrow_back" outline title="返回" />
        <q-btn :disable="loadingState" :loading="loadingState" @click="loadModelData" color="primary" dense
          icon="refresh" outline title="刷新" />
      </div>
    </div>
    <div class="shadow-2 q-mt-md">
      <q-tabs active-color="primary" align="left" dense indicator-color="primary" v-model="showingTabPanel">
        <q-tab :label="'OB合同' + pageSubTitle" name="ObContract" />
        <q-tab label="OB合同明细" name="ObContractLineList" />
        <q-tab :label="ldsLine.tabTitle.value" name="ObContractLineDetail" v-if="ldsLine.isLineTabDisp.value" />
      </q-tabs>
      <q-separator />
      <q-tab-panels :keep-alive-include="['ObContract','ObContractLineList']" keep-alive v-model="showingTabPanel">
        <q-tab-panel class="q-pa-sm" name="ObContract">
          <form-field-group :model-with-create-update="$d.form" model-id="id" title="主要信息">
            <div class="q-pa-sm">
              <div class="row q-col-gutter-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>BFS出库单号</span>
                  <easy-input :model-value="$d.form.orderId" readonly/>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>是否成功</span>
                  <easy-input :model-value="$d.form.isSuccess?'是':'否'" readonly/>
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Bill of lading</span>
                  <easy-input :model-value="$d.form.billOfLading" readonly/>
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>合同号</span>
                  <easy-input :model-value="$d.form.contractNo" readonly/>
                </div>
                <div class="col-12">
                  <span>错误信息</span>
                  <easy-input :model-value="$d.form.backMsg" readonly type="textarea" :rows="3"/>
                </div>
                <div class="col-12">
                  <span>原始请求数据</span>
                  <easy-input :model-value="$d.form.rawData" readonly type="textarea" :rows="6"/>
                </div>
              </div>
            </div>
          </form-field-group>
        </q-tab-panel>
        <q-tab-panel class="q-pa-none" name="ObContractLineList">
          <div class="row q-col-gutter-sm q-mb-sm items-center q-pt-sm">
            <div class="col-12 col-sm-6 col-md-4 col-lg-3 row q-col-gutter-sm">
              <div class="col-4 text-right searchbar-label">Material</div>
              <div class="col-8">
                <easy-input v-model="lineFpsReq.material" :readonly="lineListDataLoadingState" @focus="fx.ui.select"
                  @keyup.enter="loadLineListData(2)" />
              </div>
            </div>
            <div class="col-12 col-sm-6 col-md-4 col-lg-3 row q-col-gutter-sm">
              <div class="col-4 text-right searchbar-label">备案序号</div>
              <div class="col-8">
                <easy-input v-model="lineFpsReq.recordNumber" :readonly="lineListDataLoadingState" @focus="fx.ui.select"
                  @keyup.enter="loadLineListData(2)" />
              </div>
            </div>
            <div class="col-12 col-sm-6 col-md-4 col-lg-3 row q-col-gutter-sm">
              <div>
                <q-btn color="primary" icon="search" label="查询" @click="loadLineListData" class="col-auto" />
              </div>
            </div>
          </div>
          <q-separator />
          <q-table :columns="fpsInfo.columnsInfo" :rows="$d.obContractTableData" :loading="lineListDataLoadingState"
            :visible-columns="fpsInfo.visibleColumns" v-model:pagination="fpsInfo.paginationInfo"
            @row-dblclick="(evt,row)=>{ldhLine.lineDetailNav.goViewLine(row.lineId)}" color="primary" dense flat
            row-key="lineId" separator="cell">
            <template v-slot:top="props">
              <q-space />
              <table-col-options-cfg v-model:visible-columns="fpsInfo.visibleColumns"
                v-model:table-columns="fpsInfo.columnsInfo" class="q-mx-sm"
                @update-col-options-for-save="fpsAssist.saveColOptions"></table-col-options-cfg>
              <q-btn :icon="props.inFullscreen ? 'fullscreen_exit' : 'fullscreen'" @click="props.toggleFullscreen"
                class="q-ml-sm" dense flat />
            </template>
            <template v-slot:body-cell-operation="props">
              <q-td :props="props" auto-width>
                <q-btn dense :disable="loadingState" @click="ldhLine.lineDetailNav.goViewLine(props.row.lineId)"
                  color="primary" label="查看" class="btn-in-row q-mr-xs" />
              </q-td>
            </template>
            <template v-slot:no-data>
              <div class="full-width text-center">
                <q-icon name="error_outline" />
                无数据
              </div>
            </template>
            <!--客户端分页-->
            <template v-slot:bottom>
              <paging-bar :loading-state="lineListDataLoadingState" :pageNo="lineFpsReq.pageNo" :pageSize="lineFpsReq.pageSize"
                :totalAmount="fpsInfo.totalAmount" @pagesize-changed="fpsAssist.onPageSizeChanged"
                @go-to-page="fpsNav.gotoPage" />
            </template>
          </q-table>
        </q-tab-panel>
        <q-tab-panel class="q-pa-sm" name="ObContractLineDetail">
          <div class="q-gutter-sm">
            <q-btn @click="ldhLine.lineDetailNav.backToListTab" color="primary" icon="close" outline title="关闭"
              v-if="ldsLine.isLineViewMode.value" />
            <q-btn :disable="lineLoadingState" :loading="lineLoadingState"
              @click="loadLineModelData" color="primary" dense
              icon="refresh" outline title="刷新" v-if="ldsLine.isLineViewOrEditMode.value" />
          </div>
          <form-field-group class="q-mt-sm" :model-with-create-update="ldhLine.lineDetailInfo.lineForm"
            model-id="lineId" title="主要信息">
            <div class="q-pa-sm">
              <div class="row q-col-gutter-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Material</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.material" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>PDS Item Code</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.pdsItemCode" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>STO/PO No.</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.stoPoNo" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Bill of lading</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.billOfLading" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Delivery Quantity</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.deliveryQuantity" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Base Unit of Measure</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.baseUnitOfMeasure" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>运输方式</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.typeOfShippingNm" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>预计到港日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.estimatedDateOfArrival" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>预计入库日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.estimatedDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Group Number</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.groupId" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>合同号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.contractNo" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Group Long Text</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.ibobGroupLongText" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>出库状态</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.fixedState" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>完税日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.customReleaseDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>旅行日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.ciqReleaseDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Label中文品名</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.labelCn" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Batch</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.batch" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Mfg. Lot No.</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.mfgLotNo" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Durability expiry date</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.durabilityExpiryDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Market Regulatory Flag</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.marketRegulatoryFlag" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Manufacturing Date</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.manufacturingDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>SLED/BBD</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.sledBbd" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Expiry Date</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.expiryDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Inb. Delivery No.</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.inbDeliveryNo" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Item (SD)</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.itemSd" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Invoice No.</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.invoiceNo" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Billing Date</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.billingDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Vendor</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.vendor" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Vendor Name</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.vendorName" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Custom Tariff</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.customTariff" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Country of Origin</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.countryOfOrigin" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>SKU Description</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.skuDescription" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Division</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.division" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Product Hierachy 1</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.productHierachy1" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Product Hierachy 2</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.productHierachy2" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Gross Weight</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.grossWeight" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Weight Unit</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.weightUnit" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Unit Price</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.unitPrice" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>CIF Subtotal</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.cifSubtotal" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Currency</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.currency" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Price Unit</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.priceUnit" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>SKU Local Language</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.skuLocalLanguage" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Size</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.size" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Label Sample No.</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.labelSampleNo" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Catalog Number</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.catalogNumber" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Local Tariff Code #</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.localTariffCode" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Material Category #</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.materialCategory" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Cosmetic</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.cosmetic" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Compulsory testing</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.compulsoryTesting" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Label Requirement</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.labelRequirement" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>CIQ Temp. Registration #</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.ciqTempRegistration" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>CIQ Final Registration #</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.ciqFinalRegistration" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>通关账册中文品名</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.userField1" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>通关账册英文品名</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.userField2" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Surcharge</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.shareIncidental" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Freight Cost</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.shareFreight" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Total Surcharge</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.totalSurcharge" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Total Freight</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.rmbFreight" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Transport information</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.transportInformation" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>收货方</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.receivingPartyIdName" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>Slife</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.slife" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>PrdAttr1</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.prdattr1" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>rounding qty</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.roundingQty" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>版本号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.version" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>预计放行日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.inspectionReleaseDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>匹配净重</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.matchingNetWeight" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>匹配申报数量（件）</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.declaredQuantity" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>L账册号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.kAccountno" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>TARIFF</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.tariffValue" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>VAT</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.vatValue" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>CONSUMPTION</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.consumptionValue" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>附加关税</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.additionalTariffValue" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>附加增值税</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.additionalVatValue" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>附加消费税</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.additionalConsumptionValue" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>是否加急</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.isUrgent" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>实际入库日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.actualIbDate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>期待完成日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.expectFinishDate" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>route</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.route" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>route code</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.routecode" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>产品备案批件号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.vwImsMasterDataHpNumber" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>备案计量单位</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.recordUnit" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>法定第一计量单位</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.legalUnitOfMeasurement1" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>进境备案原产国</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.recordEntryCountryOfRecord" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>备案序号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.recordNumber" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>进境报关单号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.entryRecord" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>清单编号</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.listingNumber" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>OB合同备注</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.contractRemarks" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>发票导入日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.reportdate" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>合同生成日期</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.startCusClearanceDate" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>启运国</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.countryOfDestination" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>运输方式</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.ibpeTypeOfShipping" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>进出境关别</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.entryAndExitCustoms" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>法定第二单位</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.statutorySecondUnit" readonly />
                </div>
              </div>
              <div class="row q-col-gutter-sm q-pt-sm">
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>法定第二数量</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.quantitativeSecondQuantity" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>商品名称</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.tradename2" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>EAN/UPC</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.eanupc" readonly />
                </div>
                <div class="col-12 col-sm-6 col-md-4 col-lg-3">
                  <span>账册代码</span>
                  <easy-input :model-value="ldhLine.lineDetailInfo.lineForm.cbCode" readonly />
                </div>
              </div>
            </div>
          </form-field-group>
        </q-tab-panel>
      </q-tab-panels>
    </div>
  </q-page>
</template>

<script lang="ts">
export default {
  name: 'ObContract'
}
</script>

<script lang="ts" setup>

//region FPS配置
import {useDetailHelper} from '@njt/foundation/hooks/detailHelper'
import {reactive, ref} from 'vue'
import {GetObContractLineReq, GetObContractLineResp, ObContractInfo, ObContractLine} from 'src/defs/ims/obContract'
import {useTitleHelper} from '@njt/foundation/hooks/titleHelper'
import {useLineDetailHelper} from '@njt/foundation/hooks/lineDetailHelper'
import {ColumnInfo} from '@njt/foundation/defs/comm'
import {useFpsHelper} from '@njt/foundation/hooks/fpsHelper'

const pageTitle = 'OB合同'
useTitleHelper(pageTitle)
let showingTabPanel = ref('ObContract')

let loadingState = ref(false)

const $d = reactive({
  form: {} as ObContractInfo,
  obContractTableData: [] as ObContractLine[],
})

const loadModelData = function () {
  loadingState.value = true
  $f.axios
    .get<ObContractInfo>('/mhlbc/ims/get-ob-contract-by-id/' + detailInfo.itemId)
    .then((resp) => {
      $d.form = resp.data
    })
    .catch((err) => {
      $f.ui.showNotifyFailed($f.getAxiosErrMsg(err))
    })
    .finally(() => {
      loadingState.value = false
    })
}

const {
  detailInfo,
  detailStatus,
  detailNav
}  = useDetailHelper('/ims/ob-contract',
  $d.form,
  null,
  '/ims/ob-contract',
  '/ims/ob-contract/detail',
  null,
  null,
  loadModelData,
  null
)
const {
  pageSubTitle
} = detailStatus

let lineFpsReq: GetObContractLineReq = reactive({
  id: Number(detailInfo.itemId),
  material: null,
  recordNumber: null,
  pageNo: 1,
  pageSize: 40,
  isDescending: false,
  orderBy: null
})
let lineListDataLoadingState = ref(false)

let columnsInfoLine: ColumnInfo[] = [
  {
    label: '操作',
    name: 'operation',
    field: 'operation',
    align: 'left',
    defOrder: 0,
    defVisible: true
  },
  {
    label: '序号',
    name: 'lineId',
    field: 'lineId',
    align: 'left',
    defOrder: 1,
    sortable: true,
    defVisible: true
  },
  {
    label: '出库单序号',
    name: 'orderId',
    field: 'orderId',
    align: 'left',
    defOrder: 2,
    defVisible: true
  },
  {
    label: 'Material',
    name: 'material',
    field: 'material',
    align: 'left',
    defOrder: 3,
    sortable: false,
    defVisible: true
  },
  {
    label: 'PDS Item Code',
    name: 'pdsItemCode',
    field: 'pdsItemCode',
    align: 'left',
    defOrder: 4,
    sortable: false,
    defVisible: true
  },
  {
    label: 'STO/PO No.',
    name: 'stoPoNo',
    field: 'stoPoNo',
    align: 'left',
    defOrder: 5,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Bill of lading',
    name: 'billOfLading',
    field: 'billOfLading',
    align: 'left',
    defOrder: 6,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Delivery Quantity',
    name: 'deliveryQuantity',
    field: 'deliveryQuantity',
    align: 'left',
    defOrder: 7,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Base Unit of Measure',
    name: 'baseUnitOfMeasure',
    field: 'baseUnitOfMeasure',
    align: 'left',
    defOrder: 8,
    sortable: false,
    defVisible: true
  },
  {
    label: '运输方式',
    name: 'typeOfShippingNm',
    field: 'typeOfShippingNm',
    align: 'left',
    defOrder: 9,
    sortable: false,
    defVisible: true
  },
  {
    label: '预计到港日期',
    name: 'estimatedDateOfArrival',
    field: 'estimatedDateOfArrival',
    align: 'left',
    defOrder: 10,
    sortable: false,
    defVisible: true
  },
  {
    label: '预计入库日期',
    name: 'estimatedDate',
    field: 'estimatedDate',
    align: 'left',
    defOrder: 11,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Group Number',
    name: 'groupId',
    field: 'groupId',
    align: 'left',
    defOrder: 12,
    sortable: false,
    defVisible: true
  },
  {
    label: '合同号',
    name: 'contractNo',
    field: 'contractNo',
    align: 'left',
    defOrder: 13,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Group Long Text',
    name: 'ibobGroupLongText',
    field: 'ibobGroupLongText',
    align: 'left',
    defOrder: 14,
    sortable: false,
    defVisible: true
  },
  {
    label: '出库状态',
    name: 'fixedState',
    field: 'fixedState',
    align: 'left',
    defOrder: 15,
    sortable: false,
    defVisible: true
  },
  {
    label: '完税日期',
    name: 'customReleaseDate',
    field: 'customReleaseDate',
    align: 'left',
    defOrder: 16,
    sortable: false,
    defVisible: true
  },
  {
    label: '放行日期',
    name: 'ciqReleaseDate',
    field: 'ciqReleaseDate',
    align: 'left',
    defOrder: 17,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Label中文品名',
    name: 'labelCn',
    field: 'labelCn',
    align: 'left',
    defOrder: 18,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Batch',
    name: 'batch',
    field: 'batch',
    align: 'left',
    defOrder: 19,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Mfg. Lot No.',
    name: 'mfgLotNo',
    field: 'mfgLotNo',
    align: 'left',
    defOrder: 20,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Durability expiry date',
    name: 'durabilityExpiryDate',
    field: 'durabilityExpiryDate',
    align: 'left',
    defOrder: 21,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Market Regulatory Flag',
    name: 'marketRegulatoryFlag',
    field: 'marketRegulatoryFlag',
    align: 'left',
    defOrder: 22,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Manufacturing Date',
    name: 'manufacturingDate',
    field: 'manufacturingDate',
    align: 'left',
    defOrder: 23,
    sortable: false,
    defVisible: true
  },
  {
    label: 'SLED/BBD',
    name: 'sledBbd',
    field: 'sledBbd',
    align: 'left',
    defOrder: 24,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Expiry Date',
    name: 'expiryDate',
    field: 'expiryDate',
    align: 'left',
    defOrder: 25,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Inb. Delivery No.',
    name: 'inbDeliveryNo',
    field: 'inbDeliveryNo',
    align: 'left',
    defOrder: 26,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Item',
    name: 'itemSd',
    field: 'itemSd',
    align: 'left',
    defOrder: 27,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Invoice No.',
    name: 'invoiceNo',
    field: 'invoiceNo',
    align: 'left',
    defOrder: 28,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Billing Date',
    name: 'billingDate',
    field: 'billingDate',
    align: 'left',
    defOrder: 29,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Vendor',
    name: 'vendor',
    field: 'vendor',
    align: 'left',
    defOrder: 30,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Vendor Name',
    name: 'vendorName',
    field: 'vendorName',
    align: 'left',
    defOrder: 31,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Custom Tariff',
    name: 'customTariff',
    field: 'customTariff',
    align: 'left',
    defOrder: 32,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Country of Origin',
    name: 'countryOfOrigin',
    field: 'countryOfOrigin',
    align: 'left',
    defOrder: 33,
    sortable: false,
    defVisible: true
  },
  {
    label: 'SKU Description',
    name: 'skuDescription',
    field: 'skuDescription',
    align: 'left',
    defOrder: 34,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Division',
    name: 'division',
    field: 'division',
    align: 'left',
    defOrder: 35,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Product Hierachy 1',
    name: 'productHierachy1',
    field: 'productHierachy1',
    align: 'left',
    defOrder: 36,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Product Hierachy 2',
    name: 'productHierachy2',
    field: 'productHierachy2',
    align: 'left',
    defOrder: 37,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Gross Weight',
    name: 'grossWeight',
    field: 'grossWeight',
    align: 'left',
    defOrder: 38,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Weight Unit',
    name: 'weightUnit',
    field: 'weightUnit',
    align: 'left',
    defOrder: 39,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Unit Price',
    name: 'unitPrice',
    field: 'unitPrice',
    align: 'left',
    defOrder: 40,
    sortable: false,
    defVisible: true
  },
  {
    label: 'CIF Subtotal',
    name: 'cifSubtotal',
    field: 'cifSubtotal',
    align: 'left',
    defOrder: 41,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Currency',
    name: 'currency',
    field: 'currency',
    align: 'left',
    defOrder: 42,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Price Unit',
    name: 'priceUnit',
    field: 'priceUnit',
    align: 'left',
    defOrder: 43,
    sortable: false,
    defVisible: true
  },
  {
    label: 'SKU Local Language',
    name: 'skuLocalLanguage',
    field: 'skuLocalLanguage',
    align: 'left',
    defOrder: 44,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Size',
    name: 'size',
    field: 'size',
    align: 'left',
    defOrder: 45,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Label Sample No.',
    name: 'labelSampleNo',
    field: 'labelSampleNo',
    align: 'left',
    defOrder: 46,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Catalog Number',
    name: 'catalogNumber',
    field: 'catalogNumber',
    align: 'left',
    defOrder: 47,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Local Tariff Code #',
    name: 'localTariffCode',
    field: 'localTariffCode',
    align: 'left',
    defOrder: 48,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Material Category #',
    name: 'materialCategory',
    field: 'materialCategory',
    align: 'left',
    defOrder: 49,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Cosmetic',
    name: 'cosmetic',
    field: 'cosmetic',
    align: 'left',
    defOrder: 50,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Compulsory testing',
    name: 'compulsoryTesting',
    field: 'compulsoryTesting',
    align: 'left',
    defOrder: 51,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Label Requirement',
    name: 'labelRequirement',
    field: 'labelRequirement',
    align: 'left',
    defOrder: 52,
    sortable: false,
    defVisible: true
  },
  {
    label: 'CIQ Temp. Registration #',
    name: 'ciqTempRegistration',
    field: 'ciqTempRegistration',
    align: 'left',
    defOrder: 53,
    sortable: false,
    defVisible: true
  },
  {
    label: 'CIQ Final Registration #',
    name: 'ciqFinalRegistration',
    field: 'ciqFinalRegistration',
    align: 'left',
    defOrder: 54,
    sortable: false,
    defVisible: true
  },
  {
    label: '通关账册中文品名',
    name: 'userField1',
    field: 'userField1',
    align: 'left',
    defOrder: 55,
    sortable: false,
    defVisible: true
  },
  {
    label: '通关账册英文品名',
    name: 'userField2',
    field: 'userField2',
    align: 'left',
    defOrder: 56,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Surcharge',
    name: 'shareIncidental',
    field: 'shareIncidental',
    align: 'left',
    defOrder: 57,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Freight Cost',
    name: 'shareFreight',
    field: 'shareFreight',
    align: 'left',
    defOrder: 58,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Total Surcharge',
    name: 'totalSurcharge',
    field: 'totalSurcharge',
    align: 'left',
    defOrder: 59,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Total Freight',
    name: 'rmbFreight',
    field: 'rmbFreight',
    align: 'left',
    defOrder: 60,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Transport information',
    name: 'transportInformation',
    field: 'transportInformation',
    align: 'left',
    defOrder: 61,
    sortable: false,
    defVisible: true
  },
  {
    label: '收货方',
    name: 'receivingPartyIdName',
    field: 'receivingPartyIdName',
    align: 'left',
    defOrder: 62,
    sortable: false,
    defVisible: true
  },
  {
    label: 'Slife',
    name: 'slife',
    field: 'slife',
    align: 'left',
    defOrder: 63,
    sortable: false,
    defVisible: true
  },
  {
    label: 'PrdAttr1',
    name: 'prdattr1',
    field: 'prdattr1',
    align: 'left',
    defOrder: 64,
    sortable: false,
    defVisible: true
  },
  {
    label: 'rounding qty',
    name: 'roundingQty',
    field: 'roundingQty',
    align: 'left',
    defOrder: 65,
    sortable: false,
    defVisible: true
  },
  {
    label: '版本号',
    name: 'version',
    field: 'version',
    align: 'left',
    defOrder: 66,
    sortable: false,
    defVisible: true
  },
  {
    label: '预计放行日期',
    name: 'inspectionReleaseDate',
    field: 'inspectionReleaseDate',
    align: 'left',
    defOrder: 67,
    sortable: false,
    defVisible: true
  },
  {
    label: '匹配净重',
    name: 'matchingNetWeight',
    field: 'matchingNetWeight',
    align: 'left',
    defOrder: 68,
    sortable: false,
    defVisible: true
  },
  {
    label: '匹配申报数量（件）',
    name: 'declaredQuantity',
    field: 'declaredQuantity',
    align: 'left',
    defOrder: 69,
    sortable: false,
    defVisible: true
  },
  {
    label: 'L账册号',
    name: 'kAccountno',
    field: 'kAccountno',
    align: 'left',
    defOrder: 70,
    sortable: false,
    defVisible: true
  },
  {
    label: 'TARIFF',
    name: 'tariffValue',
    field: 'tariffValue',
    align: 'left',
    defOrder: 71,
    sortable: false,
    defVisible: true
  },
  {
    label: 'VAT',
    name: 'vatValue',
    field: 'vatValue',
    align: 'left',
    defOrder: 72,
    sortable: false,
    defVisible: true
  },
  {
    label: 'CONSUMPTION',
    name: 'consumptionValue',
    field: 'consumptionValue',
    align: 'left',
    defOrder: 73,
    sortable: false,
    defVisible: true
  },
  {
    label: '附加关税',
    name: 'additionalTariffValue',
    field: 'additionalTariffValue',
    align: 'left',
    defOrder: 74,
    sortable: false,
    defVisible: true
  },
  {
    label: '附加增值税',
    name: 'additionalVatValue',
    field: 'additionalVatValue',
    align: 'left',
    defOrder: 75,
    sortable: false,
    defVisible: true
  },
  {
    label: '附加消费税',
    name: 'additionalConsumptionValue',
    field: 'additionalConsumptionValue',
    align: 'left',
    defOrder: 76,
    sortable: false,
    defVisible: true
  },
  {
    label: 'route',
    name: 'route',
    field: 'route',
    align: 'left',
    defOrder: 77,
    sortable: false,
    defVisible: true
  },
  {
    label: 'route code',
    name: 'routecode',
    field: 'routecode',
    align: 'left',
    defOrder: 78,
    sortable: false,
    defVisible: true
  },
  {
    label: '产品备案批件号',
    name: 'vwImsMasterDataHpNumber',
    field: 'vwImsMasterDataHpNumber',
    align: 'left',
    defOrder: 79,
    sortable: false,
    defVisible: true
  },
  {
    label: '备案计量单位',
    name: 'recordUnit',
    field: 'recordUnit',
    align: 'left',
    defOrder: 80,
    sortable: false,
    defVisible: true
  },
  {
    label: '法定第一计量单位',
    name: 'legalUnitOfMeasurement1',
    field: 'legalUnitOfMeasurement1',
    align: 'left',
    defOrder: 81,
    sortable: false,
    defVisible: true
  },
  {
    label: '进境备案原产国',
    name: 'recordEntryCountryOfRecord',
    field: 'recordEntryCountryOfRecord',
    align: 'left',
    defOrder: 82,
    sortable: false,
    defVisible: true
  },
  {
    label: '备案序号',
    name: 'recordNumber',
    field: 'recordNumber',
    align: 'left',
    defOrder: 83,
    sortable: false,
    defVisible: true
  },
  {
    label: '进境报关单号',
    name: 'entryRecord',
    field: 'entryRecord',
    align: 'left',
    defOrder: 84,
    sortable: false,
    defVisible: true
  },
  {
    label: '清单编号',
    name: 'listingNumber',
    field: 'listingNumber',
    align: 'left',
    defOrder: 85,
    sortable: false,
    defVisible: true
  },
  {
    label: 'OB合同备注',
    name: 'contractRemarks',
    field: 'contractRemarks',
    align: 'left',
    defOrder: 86,
    sortable: false,
    defVisible: true
  },
  {
    label: '发票导入日期',
    name: 'reportdate',
    field: 'reportdate',
    align: 'left',
    defOrder: 87,
    sortable: false,
    defVisible: true
  },
  {
    label: '合同生成日期',
    name: 'startCusClearanceDate',
    field: 'startCusClearanceDate',
    align: 'left',
    defOrder: 88,
    sortable: false,
    defVisible: true
  },
  {
    label: '启运国',
    name: 'countryOfDestination',
    field: 'countryOfDestination',
    align: 'left',
    defOrder: 89,
    sortable: false,
    defVisible: true
  },
  {
    label: '运输方式',
    name: 'ibpeTypeOfShipping',
    field: 'ibpeTypeOfShipping',
    align: 'left',
    defOrder: 90,
    sortable: false,
    defVisible: true
  },
  {
    label: '进出境关别',
    name: 'entryAndExitCustoms',
    field: 'entryAndExitCustoms',
    align: 'left',
    defOrder: 91,
    sortable: false,
    defVisible: true
  },
  {
    label: '法定第二单位',
    name: 'statutorySecondUnit',
    field: 'statutorySecondUnit',
    align: 'left',
    defOrder: 92,
    sortable: false,
    defVisible: true
  },
  {
    label: '法定第二数量',
    name: 'quantitativeSecondQuantity',
    field: 'quantitativeSecondQuantity',
    align: 'left',
    defOrder: 93,
    sortable: false,
    defVisible: true
  },
  {
    label: '商品名称',
    name: 'tradename2',
    field: 'tradename2',
    align: 'left',
    defOrder: 94,
    sortable: false,
    defVisible: true
  },
  {
    label: 'EAN/UPC',
    name: 'eanupc',
    field: 'eanupc',
    align: 'left',
    defOrder: 95,
    sortable: false,
    defVisible: true
  },
  {
    label: '账册代码',
    name: 'cbCode',
    field: 'cbCode',
    align: 'left',
    defOrder: 96,
    sortable: false,
    defVisible: true
  },
  {
    label: '是否加急',
    name: 'isUrgent',
    field: 'isUrgent',
    align: 'left',
    defOrder: 97,
    sortable: false,
    defVisible: true
  },
  {
    label: '实际入库日期',
    name: 'actualIbDate',
    field: 'actualIbDate',
    align: 'left',
    defOrder: 98,
    sortable: false,
    defVisible: true
  },
  {
    label: '期待完成日期',
    name: 'expectFinishDate',
    field: 'expectFinishDate',
    align: 'left',
    defOrder: 99,
    sortable: false,
    defVisible: true
  },
  {
    label: '创建时间',
    name: 'createDt',
    field: 'createDt',
    align: 'left',
    defOrder: 100,
    sortable: false,
    defVisible: true,
    format: (val: string) => $f.fmt.dtFmtFullNoSec(val)
  },
  {
    label: '创建人',
    name: 'createP',
    field: 'createP',
    align: 'left',
    defOrder: 101,
    sortable: false,
    defVisible: true,
    format: (val: string, row: ObContractLine) => $f.fmt.userDisp(val, row.createPn)
  },
  {
    label: '更新时间',
    name: 'updateDt',
    field: 'updateDt',
    align: 'left',
    defOrder: 102,
    sortable: false,
    defVisible: true,
    format: (val: string) => $f.fmt.dtFmtFullNoSec(val)
  },
  {
    label: '更新人',
    name: 'updateP',
    field: 'updateP',
    align: 'left',
    defOrder: 103,
    sortable: false,
    defVisible: true,
    format: (val: string, row: ObContractLine) => $f.fmt.userDisp(val, row.updatePn)
  },

]

const loadLineListData = function (resetFpsReq?: number) {
  if (resetFpsReq) {
    if (resetFpsReq >= 1) {
      lineFpsReq.pageNo = 1
    }
    if (resetFpsReq >= 2) {
      lineFpsReq.orderBy = ''
      lineFpsReq.isDescending = false
    }
  }
  lineListDataLoadingState.value = true
  $f.axios
    .get<GetObContractLineResp>('/mhlbc/ims/get-ob-contract-line-list', {params: lineFpsReq})
    .then((resp) => {
      fpsAssist.handleGenericFpsResp(resp.data)
      $d.obContractTableData = resp.data.obContractLines
      fpsAssist.saveFpsReq(lineFpsReq)
    })
    .catch((err) => {
      $f.ui.showNotifyFailed($f.getAxiosErrMsg(err))
    })
    .finally(() => {
      lineListDataLoadingState.value = false
    })
}

const {
  fpsInfo,
  fpsAssist,
  fpsNav
} = useFpsHelper('/ims/expedited_line',
  null,
  null,
  null,
  lineFpsReq, columnsInfoLine,
  null,
  loadLineListData)

let lineLoadingState = ref(false)
const loadLineModelData = function () {
  lineLoadingState.value = true
  $f.axios
    .get<ObContractLine>('/mhlbc/ims/get-ob-contract-line-by-id/' + String(ldhLine.lineDetailInfo.lineItemId))
    .then((resp) => {
      ldhLine.lineDetailInfo.lineForm = resp.data
    })
    .catch((err) => {
      $f.ui.showNotifyFailed($f.getAxiosErrMsg(err))
    })
    .finally(() => {
      lineLoadingState.value = false
    })
}

const ldhLine = useLineDetailHelper(
  'OB合同明细',
  'ObContractLineList',
  'ObContractLineDetail',
  {},
  loadLineModelData,
  showingTabPanel,
  null,
  () => {
    // ignore
  },
)

const ldsLine = ldhLine.lineDetailStatus


const fx = $f
</script>

<style scoped>

</style>
